<!--
 * @Author: 码上talk|RC
 * @Date: 2020-09-29 16:06:55
 * @LastEditTime: 2020-11-19 16:46:52
 * @LastEditors: 码上talk|RC
 * @Description: 
 * @FilePath: /tacomall-merchant/src/pages/goods/info.vue
 * @微信:  13680065830
 * @邮箱:  3189482282@qq.com
 * @oops: Just do what I think it is right
-->
<template>
    <div class="goods-info">
        <div class="gi-section gi-base">
            <div class="gs-title">
                <span>基础信息</span>
            </div>
            <div class="gs-content">
                <table>
                    <tbody>
                        <tr>
                            <td>
                                <span>商品编号：</span>
                                <span>QSDFF093275JCS</span>
                            </td>
                            <td>
                                <span>商品编号：</span>
                                <span>QSDFF093275JCS</span>
                            </td>
                            <td>
                                <span>商品编号：</span>
                                <span>QSDFF093275JCS</span>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <span>商品编号：</span>
                                <span>QSDFF093275JCS</span>
                            </td>
                            <td>
                                <span>商品编号：</span>
                                <span>QSDFF093275JCS</span>
                            </td>
                            <td>
                                <span>商品编号：</span>
                                <span>QSDFF093275JCS</span>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <span>商品编号：</span>
                                <span>QSDFF093275JCS</span>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
        <div class="gi-section gi-spec">
            <div class="gs-title">
                <span>商品规格</span>
            </div>
            <div class="gs-content">
                <i-table :columns="columns" :data="data"></i-table>
            </div>
        </div>
        <div class="gi-section gi-img">
            <div class="gs-title">
                <span>图文详情</span>
            </div>
            <div class="gs-content"></div>
        </div>
    </div>
</template>

<script>
import { Goods } from '@/model/goods'
export default {
    data() {
        return {
            params: this.$route.query,
            goods: new Goods(),
            columns: [
                {
                    title: 'Name',
                    key: 'name'
                },
                {
                    title: 'Age',
                    key: 'age'
                },
                {
                    title: 'Province',
                    key: 'province'
                },
                {
                    title: 'City',
                    key: 'city'
                },
                {
                    title: 'Address',
                    key: 'address'
                },
                {
                    title: 'Postcode',
                    key: 'zip'
                }
            ],
            data: [
                {
                    name: 'John Brown',
                    age: 18,
                    address: 'New York No. 1 Lake Park',
                    province: 'America',
                    city: 'New York',
                    zip: 100000
                },
                {
                    name: 'Jim Green',
                    age: 24,
                    address: 'Washington, D.C. No. 1 Lake Park',
                    province: 'America',
                    city: 'Washington, D.C.',
                    zip: 100000
                },
                {
                    name: 'Joe Black',
                    age: 30,
                    address: 'Sydney No. 1 Lake Park',
                    province: 'Australian',
                    city: 'Sydney',
                    zip: 100000
                }
            ]
        }
    },
    methods: {
        init() {
            Goods.API('info', { params: { id: this.params['id'] }, data: {} }).then(res => {
                const { data } = res
                this.goods = new Goods(data)
            })
        },
    },
    created() {
        this.init()
    }
}
</script>

<style lang="less">
.goods-info {
    padding: 10px;
    background: white;
    .gi-section {
        .gs-title {
            display: flex;
            align-items: center;
            height: 70px;
            span {
                font-size: 16px;
                color: #000;
            }
        }
        .gs-content {
            padding-bottom: 20px;
        }
        &:not(:first-child) {
            border-top: 1px solid #f7f7f7;
        }
    }
    .gi-base {
        table {
            width: 100%;
            tbody {
                tr {
                    &:not(:last-child) {
                        td {
                            padding-bottom: 16px;
                        }
                    }
                }
            }
        }
    }
}
</style>